<template>
	<view class="p-20">
		<view class="bg-white p-30 border-radius">
			<view class="form-item mb-40">
				<view class="font-bold font-28">资格证书</view>
				<view class="mt-20 flex items-center flex-wrap">
					<view class="add-btn mr-20" @click="ChooseImage()">
						<uni-icons type="plusempty" size="30" color="#777"></uni-icons>
					</view>
					<image v-if="form.credential !== ''" class="mr-20" :src="imgUrl+form.credential" mode=""
						style="width: 180rpx;height: 180rpx;" @click="delect">
					</image>
				</view>
			</view>
		</view>

		<view class="bottom-view">
			<view class="bottom-btn font-white bg-g" @click="submit">保存</view>
		</view>
	</view>
</template>

<script>
	import {
		add,
		edit,
		del
	} from '../../api/apply_credential.js';
import { BASE_URL } from '../../utils/constant';
	export default {
		data() {
			return {
				imgList: [],
				imgMaxNum: 1,
				imgArr: '',
				form: {
					credential: '',
					status: 1
				},
				imgUrl: BASE_URL+ '/jeecg-boot/sys/common/static/'
			};
		},
		onLoad(options) {
			this.form.applyuserId = options.applyuserId
			const info = uni.getStorageSync('info')
			if (info && info[0]) {
				this.form = info[0]
			}
		},
		onUnload() {
			uni.removeStorageSync('info')
		},
		methods: {
			submit() {
				const _this = this
				this.$tips.showModal('是否提交信息？', () => {
					// _this.$tips.showConfirmModal('提交成功，请等待审核', () => {
					// 	uni.navigateBack()
					// })
					const info = uni.getStorageSync('info')
					if (info && info[0]) {
						edit({
							...this.form
						}).then(res => {
							if (res.code === 200) {
								_this.$tips.showConfirmModal('提交成功，请等待审核', () => {
									uni.navigateBack()
								})
							} else {
								_this.$tips.showConfirmModal('提交失败，请重试', () => {})
							}
						})
					} else {
						add({
							...this.form
						}).then(res => {
							if (res.code === 200) {
								_this.$tips.showConfirmModal('提交成功，请等待审核', () => {
									uni.navigateBack()
								})
							} else {
								_this.$tips.showConfirmModal('提交失败，请重试', () => {})
							}
						})
					}
				})
			},
			ChooseImage() {
				var _this = this;
				uni.chooseImage({
					count: 1, //默认9
					sizeType: ['original', 'compressed'], //可以指定是原图还是压缩图，默认二者都有
					sourceType: ['album', 'camera'], //从相册选择和拍照
					success: (res) => {
						var tempFilePath = res.tempFilePaths[0];
						uni.uploadFile({
							url: BASE_URL + '/jeecg-boot/sys/common/upload', //上传的服务器地址
							filePath: tempFilePath,
							method: 'POST',
							header: {
								'Authorization': this.$storage.getStorageSync('token'),// 在拦截器配置token之类的header操作，防止首次加载token后，读取不到token
								'X-Access-Token': this.$storage.getStorageSync('token')// 在拦截器配置token之类的header操作，防止首次加载token后，读取不到token
							},
							name: "file",
							success: res => {
								const resd = JSON.parse(res.data)
								console.log(resd)
								if (resd.success) {
									this.form.credential = resd.message
								} else {
									this.$tips.showConfirmModal('图片上传失败')
								}
							}
						});
					}
				});
			},
			//查看图片
			// lookImg: function(val) {
			// 	const current = val
			// 	uni.previewImage({
			// 		[BASE_URL+'/jeecg-boot/sys/common/static/'+this.form.credential],
			// 		current
			// 	})
			// },
			delect(index) {
				uni.showModal({
					title: "提示",
					content: "是否要删除该图片",
					success: (res) => {
						if (res.confirm) {
							this.form.credential = ''
						}
					}
				})
			},
		}
	}
</script>

<style lang="less">
	page {
		background-color: #f6f6f6;
		padding-bottom: 200rpx;
	}

	.bottom-view {
		width: 100vw;
		padding: 40rpx 0;
		background-color: #fff;
		position: fixed;
		bottom: 0;
		left: 0;
		z-index: 99999;
		border-top: 1px solid #efefef;

		.bottom-btn {
			width: 80vw;
			margin: auto;
			text-align: center;
			border-radius: 50rpx;
			padding: 20rpx 0;
		}
	}

	.add-btn {
		width: 180rpx;
		height: 180rpx;
		border: 1px solid #777;
		display: flex;
		align-items: center;
		justify-content: center;
	}
</style>